<template>
  <!-- 经销商对账查询 -->
  <div>
    <TopFilter :list="reconciliationTopFilterList" :cols="3" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="table"
      columnsRef="waxReconciliationformA"
      :isMemoryPagination="true"
      :dataSource="formDataList"
      :columns="columns"
      :params="fetchParams"
      :onColumnsChange="columns => (this.columns = columns)"
      :isSelectColumn="false"
      :isExportExcel="true"
      exportFileName="经销商对账查询.xlsx"
    >
      <!-- :datakey="'data'" -->
      <!-- :fetchapi="fetchApi" -->
      <!-- :fetchapi="fetchApi" -->
      <template slot="controls" slot-scope="props">
        <!-- <el-button size="small" type="primary" icon="el-icon-daochu" :disabled="exportBtn" @click="handleExport">导出</el-button> -->
        <!-- <el-button size="small" type="primary" icon="el-icon-printer" :disabled="printBtn" @click="handlePrint">打印</el-button> -->
        <!-- <el-button size="small" type="primary" icon="el-icon-plus" @click="publishInfo">新建</el-button>
        <AjaxButton :click="pushDialog" type="primary">发布</AjaxButton>
        <AjaxButton :click="offlineDialog" type="primary">下线</AjaxButton> -->
      </template>
    </FilterTable>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getReconciliationList, getExcelList } from '@/api/part/report/reconciliationQuery';
import { exportExcelFile } from '@/utils/index';
import { log } from 'util';
import moment from 'moment';
export default {
  name: 'ReconciliationQuery',
  components: {},
  mixins: [dictionary],
  props: [],
  data() {
    return {
      reconciliationTopFilterList: this.createReconciliationTopFilterList(),
      columns: this.createTableList(),
      fetchParams: { xhrAbort: true },
      fetchApi: getReconciliationList,
      exportBtn: false,
      printBtn: false,
      formDataList: [] // 内存分页
    };
  },
  methods: {
    // 打印处理
    handlePrint() {},
    // 导出处理
    handleExport() {
      // this.exportLoading = true;
      const option = {};
      console.log('查询参数', this.fetchParams);

      getExcelList(this.fetchParams).then(response => {
        console.log(response, '经销商对账查询');
        exportExcelFile(response.data, '经销商对账查询');
        // this.exportLoading = false;
        // this.exportExcel(res.records);
      });
    },
    // 展开收起调用函数
    collapseHandle() {},
    // 搜索条件改变调用方法
    changeHandle(val) {
      let etmp = val.I_DATES.split(' ', 1);
      val.I_DATES = val.I_DATES.split(' ', 1)
        .join('')
        .split('-', 3)
        .join('');
      val.I_DATEE = val.I_DATEE.split(' ', 1)
        .join('')
        .split('-', 3)
        .join('');
      // console.log('参数', val);
      this.findList({ ImportParameter: val });
      // this.fetchParams = { xhrAbort: false, ImportParameter: val };
      // this.columns = [...this.columns];
    },
    // 搜索
    async findList(val) {
      let res = await getReconciliationList(val);
      this.formDataList = res.data;
      this.columns = [...this.columns];
    },
    // 创建表单字段列表
    createTableList() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '发货单号',
          dataIndex: 'QVBELN',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '开票凭证',
          dataIndex: 'BVBELN',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '类型',
          dataIndex: 'BLART',
          sorter: true,
          filter: true,
          filterType: 'input',
          filterItems: []
        },
        {
          title: '凭证日期',
          dataIndex: 'JZRQ',
          sorter: true,
          filter: true,
          filterType: 'date-range'
        },
        {
          title: '本币金额',
          dataIndex: 'JE',
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '备注',
          dataIndex: 'BZ',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    // 创建筛选条件
    createReconciliationTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '记账日期',
          fieldName: 'I_DATES|I_DATEE',
          initialValue: [
            moment()
              .startOf('month')
              .format('YYYY-MM-DD'),
            moment().format('YYYY-MM-DD')
          ],
          placeholder: '',
          rules: [{ required: true, message: '请选择记账日期', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '公司代码',
          fieldName: 'I_CMPNY',
          placeholder: '',
          initialValue: '0001',
          rules: [{ required: true, message: '请选择公司代码', trigger: 'blur' }],
          itemList: [
            { text: '一汽大众', value: '0001' },
            { text: '文化公司', value: '0009' }
          ]
        }
      ];
    }
  }
};
</script>

<style></style>
